import { render, createVNode } from 'vue'
import XtxConfirm from './xtx-confirm.vue'

// 创建dom元素
const div = document.createElement('div')
div.setAttribute('class', 'xtx-confirm-container')
document.body.appendChild(div)

// 该函数用于渲染Xtxconfirm组件，标题和文本
export default ({ title, text }) => {
  // 为什么要返回一个promise对象?
  return new Promise((resolve, reject) => {
    const submitCallback = () => {
      render(null, div)
      resolve()
    }
    const cancelCallback = () => {
      render(null, div)
      reject(new Error('点击取消'))
    }
    // 首先创建虚拟dom
    const vnode = createVNode(XtxConfirm, { title, text, cancelCallback, submitCallback })
    // 渲染虚拟结点
    render(vnode, div)
  })
}
